<template>
  <view class="mt-2 mb-2 c-text-14">设备操作</view>

  <view class="c-br bg-white px-1 py-1">
    <van-grid clickable :border="false" column-num="4">
      <van-grid-item use-slot v-for="(item, index) in operatorList" @click="operatorClick(item.type)" :key="index">
        <i :class="[item.iconPath, 'font-size-8 mb-2']"></i>
        <text class="c-text-12">{{ item.name }}</text>
      </van-grid-item>
    </van-grid>
  </view>
</template>

<script setup lang="ts">
import useToast from '@/hooks/useToast';
import useModal from '@/hooks/useModal';
import EquipRequest from '@/request/equipRequest';
import { navigate } from '@/utils/navigate';

interface IOperatorList {
  name: string;
  type: string;
  iconPath: string;
}

interface IDataForm {
  selectType: string;
}

const operatorList = ref<IOperatorList[]>([
  {
    name: '报警记录',
    type: 'alarmRecord',
    iconPath: 'i-material-symbols-light:circle-notifications-outline',
  },
  {
    name: '紧急联系人',
    type: 'fastLinkman',
    iconPath: 'i-material-symbols-light:breaking-news-alt-1-outline-sharp',
  },
  {
    name: '通讯录',
    type: 'addressBook',
    iconPath: 'i-material-symbols-light:contact-phone-outline',
  },
  {
    name: '解绑设备',
    type: 'unbindEquip',
    iconPath: 'i-material-symbols-light:delete-forever-outline-sharp',
  },
]);

const props = defineProps<{ equipInfo: IEquipDetailRes }>();
const dataForm = reactive<IDataForm>({ selectType: '' });
const { showToast } = useToast();
const { showModal } = useModal();

onMounted(() => {
  switch (props.equipInfo.equipType) {
    case 20:
      operatorList.value.splice(0, 1);
      break;
  }
});

const operatorClick = (type: string) => {
  dataForm.selectType = type;
  switch (type) {
    case 'alarmRecord':
      navigate({ url: '/subcontract/equipment/equipDetail/viewAlarmRecords?equipId=' + props.equipInfo.equipId });
      break;
    case 'fastLinkman':
      navigate({ url: '/subcontract/equipment/addressBook/setFastLinkman?equipId=' + props.equipInfo.equipId });
      break;
    case 'addressBook':
      navigate({ url: '/subcontract/equipment/addressBook/index?equipId=' + props.equipInfo.equipId + '&equipType=2' });
      break;
    case 'unbindEquip':
      showModal('是否解绑当前设备？', {
        showCancel: true,
        success: (res) => {
          if (res.confirm) {
            EquipRequest.UnbindingEquip({ id: props.equipInfo.equipId }).then((res) => {
              showToast('解绑成功', 'success');
              setTimeout(() => {
                navigate({ url: '', type: 'navigateBack' });
              }, 1000);
            });
          }
        },
      });
      break;
  }
};
</script>
